/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

dojo.provide("nanosn.tracfaces.widgets.DataEditor");
dojo.require("dijit._Widget");
dojo.require("dijit._Templated");
dojo.require("dijit.form.Form");
dojo.declare("nanosn.tracfaces.widgets.DataEditor", [dijit._Widget, dijit._Templated],
{
    // TODO
    widgetsInTemplate: true,
    templatePath: dojo.moduleUrl("nanosn.tracfaces.widgets","templates/DataEditor.html"),

    /**
     * TODO: CSS support
     * TODO: this is a DTL String
     */
    _fieldTemplate: "<tr><td>{{ label }}:</td><td><input name='{{ editor }}' type='text' /></td></tr>",


    /**
     * this structure is similar to the structure of the layout of a DataGrid
     * Here is an example: [{name: "Id", field: "id"}]
     *   - Available options:
     *       - name (reqired)
     *          The label of the field.
     *       - field
     *          The name of the field in the store data
     *       - width
     *          The width of the column
     *       - editorType
     *          The type of editor. Allowable types are any of the dijit widgets
     *          TODOC: List all allowable types
     *       - options
     *           Used when editorType is FIXME: Select to name the allowable options
     *       - editable
     *           A boolean value that declares whether or not the cell is editable
     *       - formatter
     *           A JavaScript function that is called which returns the value
     *           to be shown in the cell. The value from the data store is
     *           passed as a parameter to the function. The returned value
     *           that is inserted into the page can be any legal HTML.
     *           It should not be a dijit Widget as that is not parsed.
     *       - get
     *           A JavaScript function that is called which returns the value
     *           to be shown in the cell. The function is passed two parameters.
     *           The first is the row index in the DataGrid. The second is the
     *           DataStore record/item. Given these two parameters, the function
     *           is expected to know what to return. It should not be a dijit
     *           Widget as that is not parsed. Care should be taken that the
     *           item parameter is not null. Tests have shown that the function
     *           may be called more often than it should be and this is
     *           highlighted with an item = null.
     *       - hidden
     *           This boolean property can be used to hide a column in the
     *           table. If its value is true the column is hidden. If false
     *           the column is displayed.
     *
     *           TODO: There should be more ... validator, required
     */
    structure: null,

    postCreate: function()
    {
        //This is typically the workhorse of a custom widget.
        //The widget has been rendered (but note that sub-widgets
        // in the containerNode have not!)

        //TODO: This is only testing
        this._generateEditFields();
    },


    _generateEditFields: function()
    {
        dojo.require("dojox.dtl");
        dojo.require("dojox.dtl.Context");

        var template = new dojox.dtl.Template(this._fieldTemplate);

        dojo.forEach(layout, function(item)
        {   
            var context = new dojox.dtl.Context(
            {
                label: item.name,
                editor: item.field
            });
            
            this.fields.innerHTML += template.render(context);

        }, this);        
    }
});